.index{
    width: 100%;
    .top{
        position: relative;
        display: flex;
        width: 100%;
        height: 60px;
        background-color: #EC4141;
        .logo{
            margin-left:15px;
            color:#fff;
            i{
                display: inline-block;
                line-height: 60px;
                font-size: 38px;
                vertical-align: middle;
            }
            span{
                font-size: 20px;
                vertical-align: middle;
            }
        }
        .search{
            display: flex;
            line-height: 60px;
            margin-left:15%;
            span{
                display: inline-block;
                color:#fff;
                cursor: pointer;
                width: 20px;
                margin-right:10px;
            }
            .searchInp{
                position: relative;
                width: 150px;
                height: 40px;
                margin: auto;
                background-color: #E13E3E;
                border-radius: 30px;
                i{
                    position: absolute;
                    left:5%;
                    top:-20%;
                    font-size: 20px;
                    color:#fff;
                }
                ::v-deep.el-input{
                    position: absolute;
                    top:-23%;
                    left:15%;
                    width: 110px;
                }
                ::v-deep.el-input__inner{
                    background-color: transparent;
                    border:0;
                    color:#fff;
                }
            }
        }
        .info{
            position: absolute;
            width: 200px;
            right:40px;
            line-height: 60px;
            img{
                width: 30px;
                border-radius: 50%;
                vertical-align: middle;
                margin-right:10px;
            }
            span{
                vertical-align: middle;
                color:#fff;
                font-size: 12px;
            }
            .outLogin{
                cursor: pointer;
                margin-left:10%;
                i{
                    vertical-align: middle;
                    font-size: 16px;
                }
                span{
                    vertical-align: middle;
                    margin-left:5px;
                }
            }
        }
    }
    .main{
        display: flex;
        .menu{
            width: 15%;
            height: 870px;
            border-right:1px solid #E1E1E1;
            .menuFX{
                ul{
                    margin: 10px 0;
                    li{
                        cursor: pointer;
                        height: 40px;
                        line-height: 40px;
                        padding-left:20px;
                        font-size: 16px;
                        background-color: transparent;
                    }
                    .liActive{
                        background-color: #F5F5F6;
                        font-weight: 700;
                        font-size: 18px;
                    }
                    .liMouse{
                        background-color: #F5F5F6;
                    }
                }
    
            }
            .myMusic{
                padding-left:20px;
                color:#9F9F9F;
                font-size: 14px;
            }
            .myMusicUl{
                ul{
                    margin: 10px 0;
                    li{
                        cursor: pointer;
                        height: 40px;
                        line-height: 40px;
                        padding-left:20px;
                        font-size: 16px;
                        background-color: transparent;
                        i{
                            font-size: 20px;
                            vertical-align: middle;
                        }
                        span{
                            display: inline-block;
                            margin-left:10px;
                            vertical-align: middle;
                        }
                    }
                    .myMusicUlLiActive{
                        background-color: #F5F5F6;
                    }
                }
    
            }
            .songSheet{
                .songSheetColor{
                    color:#9FB7C7;
                }
            }
        }
        .content{
            width: 85%;
            height: 870px;
            padding:15px 20px;
            box-sizing: border-box;
            overflow:auto;
        }
    }
    .bottom{
        position: fixed;
        bottom:0;
        width: 100%;
        height: 70px;
        border-top:1px solid #ECECED;
        background-color: #F6F6F8;
    }
}